.item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 32px;
  padding: var(--spacing-2);
  font-size: var(--font-size-4);
  color: var(--global-foreground);
  cursor: default;
  background: var(--global-background);
  border-radius: var(--border-radius-base);
  transition: background-color var(--default-hover-animation-duration)
    var(--default-timing-function);
}

.content {
  display: flex;
  gap: var(--spacing-2);
  align-items: center;
}

.icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  color: var(--overlay-20);
}

.iconSpacer {
  width: 16px;
  height: 16px;
}

.label {
  flex: 1;
}

.item[data-state='checked'] {
  background-color: var(--dropdown-background-active);
}

.item[data-state='checked'] span[data-state='checked'] {
  color: var(--primary-accent);
}

.item:hover,
.item:focus {
  background-color: var(--dropdown-background-hover);
}

.item:focus-visible {
  outline: none;
}
